<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title></title>
  <link rel="stylesheet" type="text/css" href="http://static.joyowo.com/public/global/dist/css/global/global.css">
  <link rel="stylesheet" type="text/css" href="http://static.joyowo.com/public/xm/dist/css/common/common.css">
  <link rel="stylesheet" type="text/css" href="http://static.joyowo.com/lib/cmd-plugins/validForm/5.3.2/validform.css">
  <link rel="stylesheet" type="text/css" href="http://static.joyowo.com/lib/plugins/datepicker/datepicker.css" />
  <script type="text/javascript" src="http://static.joyowo.com/lib/seajs/2.3.0/sea-debug.js"></script>
  <script type="text/javascript" src="http://static.joyowo.com/lib/seajs-plugins/seajs-preload/1.0.0/seajs-preload.js"></script>
  <script type="text/javascript" src="http://static.joyowo.com/public/xm/config/seajs/seajs-config.js"></script>
</head>


<body>
  <div class="site-nav">
    <a class="site-nav-logo" href=""></a>
    <ul class="site-nav-right">
      <li>
        <a href="">用户中心</a>
      </li>
      <li>
        <a href="">商家中心</a>
      </li>
      <li>
        <a href="">返回首页</a>
      </li>
      <li>
        <a href="">帮助中心</a>
      </li>
      <li>
        <a href="">在线质询</a>
      </li>
      <li>
        <span class="service-phone">400-005-7107</span>
      </li>
    </ul>
  </div>
  <div class="xm-nav">
    <a class="xm-modules nav-line" href="">
      <span class="icon" href="">app</span>
    </a>
    <a class="xm-home" href="">
      <span class="icon">home</span>
      <!-- <span >我的小秘书</span> -->
    </a>
    <ul class="nav-modules-list">
      <li class="current-modules">
        <span class="icon">recruitment</span>
        <span>人才招聘</span>
      </li>
      <li class="my-modules">
        <div class="my-modules-hd">我的服务<span class="triangle"></span></div>
        <div class="my-modules-panel">
          <div class="my-modules-list-wrap">
            <ul class="my-modules-list">
              <li>
                <a href="">
                  <span class="icon"></span>
                  新人报道
                </a>
              </li>
              <li>
                <a href="">
                  <span class="icon"></span>
                  新人报道
                </a>
              </li>
              <li>
                <a href="">
                  <span class="icon"></span>
                  新人报道
                </a>
              </li>
              <li>
                <a href="">
                  <span class="icon"></span>
                  新人报道
                </a>
              </li>
              <li>
                <a href="">
                  <span class="icon"></span>
                  新人报道
                </a>
              </li>
            </ul>
          </div>
        </div>
      </li>
    </ul>
    <ul class="xm-nav-right">
      <li class="xm-message nav-line">
        <a href="">
          <span class="icon">小蜜消息</span>
          <span class="icon icon_num  icon_num_total">22</span>
        </a>
        <ul class="xm-message-list">
          <li>
            <a href="">
              <span class="list-square"></span>
              官方消息
              <span class="icon icon_num">11</span>
            </a>
          </li>
          <li>
            <a href="">
              <span class="list-square"></span>
              企业动态
              <span class="icon icon_num">11</span>
            </a>
          </li>
          <li>
            <a href="">
              <span class="list-square"></span>
              申请待处理
              <span class="icon icon_num">11</span>
            </a>
          </li>
          <li>
            <a href="">
              <span class="list-square"></span>
              订单待付款
              <span class="icon icon_num">11</span>
            </a>
          </li>
        </ul>
      </li>
      <li class="xm-settings nav-line">
        <a href="">
          <span class="icon">小蜜设置</span>
        </a>
        <ul class="xm-settings-list">
          <li>
            <a href="">
              <span class="list-square"></span>
              组织机构
            </a>
          </li>
          <li>
            <a href="">
              <span class="list-square"></span>
              邮箱设置
            </a>
          </li>
          <li>
            <a href="">
              <span class="list-square"></span>
              短信账户
            </a>
          </li>
          <li>
            <a href="">
              <span class="list-square"></span>
              权限分配
            </a>
          </li>
        </ul>
      </li>
      <li class="user-center nav-line">
        <div>
          <div class="user_avatars_wrap">
            <img class="user_avatars-img" src="http://e.hiphotos.baidu.com/image/h%3D200/sign=3d183a896f81800a71e58e0e813533d6/34fae6cd7b899e51e3f3f91241a7d933c8950db3.jpg" >
            <span class="user_avatars-imgShade"></span>
          </div>
          <span class="user-name">海绵宝宝海绵宝宝海绵宝宝</span>
          <span class="triangle"></span>
          <ul class="user-center-list">
            <li>
              <a href="">
                <span class="list-square"></span>
                用户中心
              </a>
            </li>
            <li>
              <a href="">
                <span class="list-square"></span>
                我的订单
              </a>
            </li>
            <li>
              <a href="">
                <span class="list-square"></span>
                账户管理
              </a>
            </li>
            <li class="logout">
              <a href="">
                <span class="icon icon-logout"></span>
                退出
              </a>
            </li>
          </ul>
        </div>
      </li>
    </ul>
  </div>
  <div class="xm-wrap">
    <div class="side-bar-left">
      <div class="side-bar-header">
        <span class="icon"></span>
        人才招聘
      </div>
      <ul class="side-bar-list">
        <li class="actived">
          <a href="">
            <span class="list-square"></span>
            招聘日期安排
            <span class="triangle"></span>
          </a>
        </li>
        <li>
          <a href="">
            <span class="list-square"></span>
            邀约面试
            <span class="triangle"></span>
          </a>
        </li>
        <li>
          <a href="">
            <span class="list-square"></span>
            人员面试进度
            <span class="triangle"></span>
          </a>
        </li>
        <li>
          <a href="">
            <span class="list-square"></span>
            职位招聘进度
            <span class="triangle"></span>
          </a>
        </li>
        <li>
          <a href="">
            <span class="list-square"></span>
            录用人才
            <span class="triangle"></span>
          </a>
        </li>
        <li>
          <a href="">
            <span class="list-square"></span>
            人才库
            <span class="triangle"></span>
          </a>
        </li>
      </ul>
    </div>
    <div class="content-right">
      <div class="content-header">
        <div class="content-breadcrumb">
          <span class=" first">
          邀约面试
          </span>
        </div>
        <div class="content-header-right">
          <a href="">吐槽</a>
          <a href="" class="last">帮助</a>
        </div>
      </div>
      <div class="content-main">
        插件api地址  <a href="">http://validform.rjboy.cn/document.html</a>
        基本表单
        <form class="from-basic">
          <div class="form-group">
            <label>Email address</label>
            <div class="input-group">
              <div class="input-group-addon addon-datePicker">@</div>



              <!--这边验证格式  datatype="js-input" 请注意-->
              <input class="form-control datePicker" type="text" value="" name="name" datatype="js-input" sucmsg="用户名验证通过！" nullmsg="时间插件和表单验证结合" defumsg="时间插件和表单验证结合" errormsg="时间插件和表单验证结合"  readonly />



            </div>
          </div>
          <button type="submit" class="btn">Submit</button>
        </form>
      </div>
    </div>
  </div>
</body>

<script type="text/javascript">
seajs.use(['{plugins}/validForm/5.3.2/validform', '{plugins}/datepicker/datepicker'], function() {
  $(".from-basic").Validform({
    tiptype: 3
  });

  $('.datePicker').DatePicker({
    date: '2014-1-1',
    current: '2014-1-1',
    calendars: 1,
    starts: 0,
    position: "bottom",
    onChange: function(formated, dates) {
      //请赋值完之后手动触发下该input上已经绑定好的chang事件
      $('.datePicker').val(formated).change();
    }
  });
});
</script>
</html>